<!-- 顶部导航组件 -->
<!-- 使用说明：<nav-bar></nav-bar> -->
<template>
  <div id="navbar-wrap">
    <el-breadcrumb separator="/">
      <el-breadcrumb-item
        v-for="(item, index) in navPath"
        :key="index"
        :to="{ path: item.path, query: item.query }"
      >
        <div class="flex align-center">
           <el-icon> <component :is="item.icon" /> </el-icon><span>{{ item.name }}</span>
        </div>
      </el-breadcrumb-item>
      <!-- <el-breadcrumb-item>收单管理</el-breadcrumb-item> -->
    </el-breadcrumb>
  </div>
</template>
<script setup>
import {ref } from "vue"
import { Goods } from "@element-plus/icons-vue"
import { useLocaleStore } from "@/store/locales"
const useLocale = useLocaleStore()
let navPath=useLocale.navPath;
console.log(navPath);
// data() {
//   return {};
// },
// computed: {
//   navPath() {
//     console.log(this.$store.getters.getNavPath);
//     return this.$store.getters.getNavPath;
//   }
// },
// methods: {

//   toggleFullscreen() {
//     if (!screenfull.enabled) {
//       this.$message.error("您的浏览器不支持全屏");
//       return false;
//     }
//     screenfull.toggle();
//     // isFullscreen 居然是反的
//     this.isFullscreen = !screenfull.isFullscreen;
//   },
// },
// watch: {
//   $route(to, from) {
//     this.pathName = this.$route.path.substring(1);
//     this.nowPath = this.$route.path;
//   }
// }
</script>
<style scoped lang="scss">
#navbar-wrap {

  margin-top: 10px;
  margin-bottom: 20px;
  // box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}
</style>
